<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>JQUERY UI</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.2.custom.css" rel="stylesheet" media="screen" />
        <script type="text/javascript" src="js/jquery-1.4.2.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.8.2.custom.js"></script>
        <style type="text/css">
            .draggableDiv {
                width: 150px;
                height: 150px;
                padding: 0.5em;
                background-color: gray;
                text-align: center;
            }
        </style>
        <script type="text/javascript">
            $(function(){
                $("div").addClass("draggableDiv");
                $("div").draggable().resizable();
            });
        </script>
    </head>
    <body>
        <div class="ui-widget-content" style="z-index : 10000">
            <p>drag me</p>
        </div>
        <div  class="ui-widget-content" style="background-color: green; z-index: 10001">
            <p>fdfdfd</p>
        </div>
    </body>
</html>
